<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <title>教师管理界面</title>
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/css/all.min.css" rel="stylesheet">
    <style>
        .sidebar {
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            z-index: 100;
            padding: 48px 0 0;
            box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
            background-color: #f8f9fa;
        }
        .sidebar-sticky {
            position: relative;
            top: 0;
            height: calc(100vh - 48px);
            padding-top: .5rem;
            overflow-x: hidden;
            overflow-y: auto;
        }
        .navbar {
            box-shadow: 0 2px 4px rgba(0,0,0,.1);
        }
        .main-content {
            margin-left: 240px;
            padding: 20px;
        }
        .nav-link {
            color: #333;
            padding: 10px 20px;
        }
        .nav-link:hover {
            background-color: #e9ecef;
        }
        .nav-link.active {
            background-color: #007bff;
            color: white;
        }
        .nav-link i {
            margin-right: 10px;
        }
        .card {
            margin-bottom: 20px;
            box-shadow: 0 2px 4px rgba(0,0,0,.1);
        }
    </style>
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
        <div class="container-fluid">
            <a class="navbar-brand" href="#">学生成绩管理系统</a>
            <div class="d-flex">
                <span class="navbar-text me-3">
                    欢迎，${sessionScope.user.username}
                </span>
                <button class="btn btn-outline-light" onclick="logout()">退出</button>
            </div>
        </div>
    </nav>

    <div class="container-fluid">
        <div class="row">
            <nav class="col-md-3 col-lg-2 d-md-block sidebar">
                <div class="sidebar-sticky">
                    <ul class="nav flex-column">
                        <li class="nav-item">
                            <a class="nav-link active" href="#" id="profileLink">
                                <i class="fas fa-user"></i>个人信息
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#" id="passwordLink">
                                <i class="fas fa-key"></i>修改密码
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#" id="studentsLink">
                                <i class="fas fa-users"></i>学生管理
                            </a>
                        </li>
                    </ul>
                </div>
            </nav>

            <main class="main-content">
                <!-- 个人信息 -->
                <div id="profile" class="content-section">
                    <h2 class="mb-4">个人信息</h2>
                    <div class="card">
                        <div class="card-body">
                            <form id="profileForm">
                                <div class="mb-3">
                                    <label class="form-label">工号</label>
                                    <input type="text" class="form-control" id="teacherId" readonly>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">中文名</label>
                                    <input type="text" class="form-control" id="chineseName">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">英文名</label>
                                    <input type="text" class="form-control" id="englishName">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">电话</label>
                                    <input type="text" class="form-control" id="tel">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">管理班级</label>
                                    <input type="text" class="form-control" id="classManaged" readonly>
                                </div>
                                <button type="submit" class="btn btn-primary">保存修改</button>
                            </form>
                        </div>
                    </div>
                </div>

                <!-- 修改密码 -->
                <div id="password" class="content-section" style="display: none;">
                    <h2 class="mb-4">修改密码</h2>
                    <div class="card">
                        <div class="card-body">
                            <form id="passwordForm">
                                <div class="mb-3">
                                    <label class="form-label">原密码</label>
                                    <input type="password" class="form-control" id="oldPassword" required>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">新密码</label>
                                    <input type="password" class="form-control" id="newPassword" required>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">确认新密码</label>
                                    <input type="password" class="form-control" id="confirmPassword" required>
                                </div>
                                <button type="submit" class="btn btn-primary">修改密码</button>
                            </form>
                        </div>
                    </div>
                </div>

                <!-- 学生管理 -->
                <div id="students" class="content-section" style="display: none;">
                    <h2 class="mb-4">学生管理</h2>
                    <div class="card">
                        <div class="card-body">
                            <div class="mb-3">
                                <input type="text" class="form-control" id="studentSearch" placeholder="搜索学生...">
                            </div>
                            <div class="table-responsive">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>学号</th>
                                            <th>中文名</th>
                                            <th>英文名</th>
                                            <th>电话</th>
                                            <th>班级</th>
                                            <th>学期</th>
                                            <th>期中成绩</th>
                                            <th>期末成绩</th>
                                            <th>状态</th>
                                            <th>操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="studentList">
                                        <!-- 学生列表将通过JavaScript动态加载 -->
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </main>
        </div>
    </div>

    <!-- 编辑成绩模态框 -->
    <div class="modal fade" id="editGradeModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">编辑成绩</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="editGradeForm">
                        <input type="hidden" id="editStudentId">
                        <div class="mb-3">
                            <label class="form-label">学号</label>
                            <input type="text" class="form-control" id="editStudentIdDisplay" readonly>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">姓名</label>
                            <input type="text" class="form-control" id="editStudentName" readonly>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">期中成绩</label>
                            <input type="number" class="form-control" id="editMidMarks" min="0" max="100">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">期末成绩</label>
                            <input type="number" class="form-control" id="editEndMarks" min="0" max="100">
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="saveGrade()">保存</button>
                </div>
            </div>
        </div>
    </div>

    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/bootstrap.bundle.min.js"></script>
    <script>
        function logout() {
            $.post('${pageContext.request.contextPath}/user/logout', function() {
                window.location.href = '${pageContext.request.contextPath}/login.jsp';
            });
        }

        // 导航切换
        $('.nav-link').click(function(e) {
            e.preventDefault();
            $('.nav-link').removeClass('active');
            $(this).addClass('active');
            $('.content-section').hide();
            $('#' + $(this).attr('id').replace('Link', '')).show();
        });

        // 加载教师信息
        function loadTeacherInfo() {
            $.get('${pageContext.request.contextPath}/teacher/${sessionScope.user.username}', function(teacher) {
                $('#teacherId').val(teacher.teacherId);
                $('#chineseName').val(teacher.chineseName);
                $('#englishName').val(teacher.englishName);
                $('#tel').val(teacher.tel);
                $('#classManaged').val(teacher.classManaged);
            });
        }

        // 保存个人信息
        $('#profileForm').submit(function(e) {
            e.preventDefault();
            const data = {
                teacherId: $('#teacherId').val(),
                chineseName: $('#chineseName').val(),
                englishName: $('#englishName').val(),
                tel: $('#tel').val(),
                classManaged: $('#classManaged').val()
            };

            $.ajax({
                url: '${pageContext.request.contextPath}/teacher/update',
                type: 'PUT',
                contentType: 'application/json',
                data: JSON.stringify(data),
                success: function(response) {
                    if (response.success) {
                        alert('个人信息更新成功');
                    } else {
                        alert(response.message);
                    }
                }
            });
        });

        // 修改密码
        $('#passwordForm').submit(function(e) {
            e.preventDefault();
            const newPassword = $('#newPassword').val();
            const confirmPassword = $('#confirmPassword').val();

            if (newPassword !== confirmPassword) {
                alert('两次输入的密码不一致');
                return;
            }

            const data = {
                username: '${sessionScope.user.username}',
                oldPassword: $('#oldPassword').val(),
                newPassword: newPassword
            };

            $.ajax({
                url: '${pageContext.request.contextPath}/user/update-password',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify(data),
                success: function(response) {
                    if (response.success) {
                        alert('密码修改成功');
                        $('#passwordForm')[0].reset();
                    } else {
                        alert(response.message);
                    }
                }
            });
        });

        // 加载学生列表
        function loadStudents() {
            $.get('${pageContext.request.contextPath}/teacher/class-info', function(response) {
                if (response.success) {
                    const students = response.data;
                    let html = '';
                    students.forEach(student => {
                        html += '<tr>' +
                            '<td>' + student.studentId + '</td>' +
                            '<td>' + student.chineseName + '</td>' +
                            '<td>' + student.englishName + '</td>' +
                            '<td>' + student.tel + '</td>' +
                            '<td>' + student.stuClass + '</td>' +
                            '<td>' + student.semester + '</td>' +
                            '<td>' + (student.midMarks || '-') + '</td>' +
                            '<td>' + (student.endMarks || '-') + '</td>' +
                            '<td>' + student.stuStatus + '</td>' +
                            '<td>' +
                            '<button class="btn btn-sm btn-primary" onclick="editGrade(\'' + student.studentId + '\', \'' + student.chineseName + '\', ' + (student.midMarks || 'null') + ', ' + (student.endMarks || 'null') + ')">编辑成绩</button>' +
                            '</td>' +
                            '</tr>';
                    });
                    $('#studentList').html(html);
                }
            });
        }

        // 搜索学生
        $('#studentSearch').on('input', function() {
            const searchText = $(this).val().toLowerCase();
            $('#studentList tr').each(function() {
                const text = $(this).text().toLowerCase();
                $(this).toggle(text.includes(searchText));
            });
        });

        // 编辑成绩
        function editGrade(studentId, studentName, midMarks, endMarks) {
            $('#editStudentId').val(studentId);
            $('#editStudentIdDisplay').val(studentId);
            $('#editStudentName').val(studentName);
            $('#editMidMarks').val(midMarks);
            $('#editEndMarks').val(endMarks);
            $('#editGradeModal').modal('show');
        }

        // 保存成绩
        function saveGrade() {
            const data = {
                studentId: $('#editStudentId').val(),
                midMarks: +$('#editMidMarks').val(),
                endMarks: +$('#editEndMarks').val()
            };

            $.ajax({
                url: '${pageContext.request.contextPath}/teacher/update-grade',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify(data),
                success: function(response) {
                    if (response.success) {
                        alert('成绩更新成功');
                        $('#editGradeModal').modal('hide');
                        loadStudents();
                    } else {
                        alert(response.message);
                    }
                }
            });
        }

        // 页面加载完成后加载数据
        $(document).ready(function() {
            loadTeacherInfo();
            loadStudents();
        });
    </script>
</body>
</html> 